<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<title>Login 博以至客</title>
		<!-- 样 式 文 件 -->
		<link rel="stylesheet" href="../component/pear/css/pear.css" />
<!--		<link rel="stylesheet" href="../css/xadmin.css">-->
		<link rel="stylesheet" href="../admin/css/other/login.css" />
		<link rel="shortcut icon" th:href="@{favicon.ico}" />
	</head>
    <!-- 代 码 结 构 -->
	<body background="../admin/images/background.svg" style="background-size: cover;">
		<form class="layui-form" action="javascript:void(0);">
			<div class="layui-form-item">
				<img class="logo" src="../admin/images/logo.png" />
				<div class="title" style="font-family: 楷体">博以 至客</div>
				<div class="desc" style="font-family: 楷体">
					一 款 技 术 人 之 间 的 沟 通 工 具
				</div>
			</div>
			<div class="layui-form-item">
				<input id="user_id"name="user_id" placeholder="请输入账号 :" lay-verify="required" hover class="layui-input"  />
			</div>
			<div class="layui-form-item">
				<input id="user_password"name="user_password" type="password" placeholder="请输入密码 :" lay-verify="required" hover class="layui-input"  />
			</div>
			<div class="layui-form-item">
				<input id="yzm" placeholder="验证码 : "  hover  lay-verify="required" class="code layui-input layui-input-inline"  />
				<img src="../admin/images/captcha.gif" class="codeImage" />
			</div>
			<div class="layui-form-item">
				<input  type="checkbox" name="" title="记住密码" lay-skin="primary" checked>
				<a  id="butt2" type="button"  style="width:100%;" onclick="xadmin.open('忘记密码','/html/forgetPassword.html',500,250)">忘记密码</a>
			</div>
			<hr>
			<a id="butt" type="button"  style="width:100%;" onclick="xadmin.open('注册','/html/insertUser.html',500,500)">没有账号?点击注册</a>
			<div class="layui-form-item">
				<button id="btn" type="button" class="pear-btn pear-btn-success login" lay-submit lay-filter="login" >
					登 入
				</button>
			</div>
		</form>
		<!-- 资 源 引 入 -->
		<script src="../component/js/jquery-3.3.1.js"></script>
		<script src="../component/layui/layui.js"></script>
		<script src="../component/pear/pear.js"></script>
		<script type="text/javascript" src="../component/js/xadmin.js"></script>
		<script language="javascript">
			var input =document.getElementById("yzm")

			input.addEventListener("keyup",function (event)
			{
				event.preventDefault();
				if(event.keyCode === 13){
					document.getElementById("btn").click();
				}
			})
		</script>
		<script>
			layui.use(['form', 'button', 'popup'], function() {
				var form = layui.form;
				var button = layui.button;
				var popup = layui.popup;

                // 登 录 提 交
				form.on('submit(login)', function() {
					/// 验证
					$.ajax(
							{
								type: "post",
								url:"/user/toLogin",
								data: {"user_id":$("#user_id").val(),"user_password":$("#user_password").val()},
								dataType: "json",
								success:function (data) {
									if(data.token!=null){
										button.load({
											elem: '.login',
											time: 1000,
											done: function() {
												console.log(data)
												popup.success("登录成功!", function() {
								window.location.href = "/login?token="+data.token+"&user_id="+data.user_id+"&user_role="+data.user_role
					                    });
					                        }
										})
									}else {
										button.load({
											elem: '.login',
											time: 1000,
											done: function() {
												popup.success("账号/密码错误!", function() {

												});
											}
										})
									}
								},
								error:function () {
									button.load({
										elem: '.login',
										time: 1500,
										done: function() {
											popup.success("登录出错啦!", function() {
											});
										}
									})
								}
							}
					)
					/// 登录
					return false;
				
				});
			})
		</script>
	</body>
</html>
